<template>
  <div>
    <svg-icon
      :class="{ 'is_active': isActive }"
      class="hamburger"
      icon-class="menu"
      @click="toggleClick" />
  </div>
</template>

<script>
export default {
  name: 'Hamburger',
  props: {
    isActive: {
      type: Boolean,
      default: false
    },
    toggleClick: {
      type: Function,
      default: null
    }
  }
};
</script>

<style lang="scss">
.hamburger {
  cursor: pointer;
  width: 20px !important;
  height: 50px !important;
}
.hamburger.is_active {
  transform: rotate(180deg);
}
</style>

